
@mixin form-item-control-theme($theme) {
  $shadow-color: lighten($theme, 20%);
  .ui-input {
    border-color: $theme;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px $shadow-color;
  }
  .ui-form-explain {
    color: $theme;
  }
}

/* ui-form */
.ui-form {
  display: block;
  margin-top: 0;
}

.ui-form-horizontal {
  .ui-form-item {

    &:before {
      content: " ";
      display: table;
    }

    &:after {
      content: " ";
      display: table;
      clear: both;
      visibility: hidden;
      font-size: 0;
      height: 0;
    }

    > label {
      padding-top: 6px;
      text-align: right;
    }
  }
}

.ui-form-inline {

  &:before {
    content: " ";
    display: table;
  }

  &:after {
    content: " ";
    display: table;
    clear: both;
    visibility: hidden;
    font-size: 0;
    height: 0;
  }

  .ui-form-item {
    display: inline-block;

    > label {
      padding-right: 6px;
    }

    > .ui-form-item-control {
      display: inline-block;
      width: auto;
      vertical-align: middle;
    }

    .ui-form-explain {
      margin-top: 0;
    }
  }
}

/* ui-form-item */
.ui-form-item {
  margin-bottom: 15px;

  > label {
    display: inline-block;
    max-width: 100%;
    margin-bottom: 5px;
    color: #333;

    .ui-form-item-required {
      color: $base-theme-error;
      margin-right: 3px;
    }
  }

  .ui-form-item-control {
    line-height: 30px;

    /* form-item-control theme */
    &.theme-default {
      @include form-item-control-theme($base-theme-default);
    }
    &.theme-error {
      @include form-item-control-theme($base-theme-error);
    }
    &.theme-warning {
      @include form-item-control-theme($base-theme-warning);
    }
  }

  .ui-form-explain {
    line-height: 1.5;
    padding-top: 5px;
    color: gray;
  }

}
